{extend name="../../admin/view/main"}

{block name="style"}{include file='educlass/form-style'}{/block}

{block name='content'}
<style>
    .upload-image-box {
        width: 130px;
        height: 110px;
        border: 1px solid rgba(125, 125, 125, .1);
        background-size: cover;
    }
    .upload-file-box {
        width: 80px;
        height: 50px;
        border: 1px solid rgba(125, 125, 125, .1);
        background-size: cover;
    }


</style>
<div id="dialogFormEditor" class="layui-clear nowrap padding-bottom-30">
    <div class="layui-card news-right">
        <div class="layui-card-body">
            <!--<form onsubmit="return false" data-auto="true" action="{:request()->url()}" method="post" class='layui-form layui-card' autocomplete="off">-->
            <form class="layui-form padding-20" role="form" name="dialogFormEditor" onsubmit="return false">

                <label class="layui-form-item relative block">
                    <span class="color-green">课程名称</span>
                    <select class="layui-select" lay-filter="demo" lay-verify="required" required name="dlg-name">
                        <option value="">请选择课程名称</option>
                        {foreach $course as $key=>$vo}
                            <option value="{$vo.id}">{$vo.name}</option>
                        {/foreach}
                    </select>
                </label>
                <label class="layui-form-item relative block">
                    <span class="color-green">课时量</span>
                    <input maxlength="4" value="0" placeholder="请在这里输入课时量" name='dlg-hour' class="layui-input">
                </label>
                <label class="layui-form-item relative block">
                    <span class="color-green">授课教师</span>
                    <input maxlength="8" placeholder="请在这里输入授课教师" name='dlg-teacher' class="layui-input">
                </label>
                <div class="layui-form-item text-center padding-top-30">
                    <button onclick="addCourse()" type="button" class="layui-btn">保存信息</button>
                </div>
            </form>
        </div>
    </div>
</div>
<div name="course-template" style="display: none;">
    <li data-course-id="__ID__" data-teacher="__TEACHER__" data-hour="__HOUR__" class="course-item">
        <span>__NAME__，授课教师：__TEACHER__，课时：__HOUR__</span>
        <span class="nav-icon padding-left-15 fa fa-trash"></span>
    </li>
</div>
{/block}

{block name='script'}
<script>
window.form.render();
window.$= layui.$;
function addCourse() {
    var id = $("select[name=dlg-name]").val();
    var name = $("select[name=dlg-name] option:selected").text();
    var teacher = $("input[name=dlg-teacher]").val();
    var hour = $("input[name=dlg-hour]").val();
    if($("select[name=dlg-name]").val()==false){
        layer.msg("请选择课程名称");
        return false;
    }

    var html = $("div[name=course-template]").html();
    html = html.replace("__ID__", id);
    html = html.replace("__NAME__", name);
    html = html.replace("__TEACHER__", teacher);
    html = html.replace("__TEACHER__", teacher);
    html = html.replace("__HOUR__", hour);
    html = html.replace("__HOUR__", hour);
    //console.log($("ul[name=course-box]").html());
    $("ul[name=course-box]").append(html);
    //alert("课程添加成功");
    $("input[name=dlg-name]").val("");
    $("input[name=dlg-teacher]").val("");
    $("input[name=dlg-hour]").val("");
    $(".layui-layer-close").click();
}
</script>




{/block}